<template>
    <div id="main" class="logincoent">
        <div class="rebackgroundimg">
            <div class="registruer" style="height: 680px;">
                <div class="regrnamepwd">
                    <p class="iteljk">注册<span><a @click="$router.push({name:'login'})">已注册可直接登录</a></span></p>

                    <div>
                        <ul class="ul_form">
                            <li class="user">
                                <i class="iconfont icon-yonghu"></i>
                                <input type="text" class="username" v-model="users.username" name="username"
                                    required="required" placeholder="请输入用户名">
                            </li>
                            <li class="pwdmia">
                                <i class="iconfont icon-mima"></i>
                                <input type="password" class="pwd" v-model="users.password" name="password"
                                    required="required" placeholder="请输入密码">
                            </li>
                            <li class="pwdmia">
                                <i class="iconfont icon-zhanghuxinxi"></i>
                                <input type="text" class="pwd" v-model="users.name" name="name" placeholder="请输入收货人">
                            </li>
                            <li class="pwdmia">
                                <i class="iconfont icon-shouji"></i>
                                <input type="text" class="pwd" v-model="users.phone" name="phone" placeholder="请输入收货电话">
                            </li>
                            <li class="pwdmia">
                                <i class="iconfont icon-home_list"></i>
                                <input type="text" class="pwd" v-model="users.address" name="address" placeholder="请输入收货地址">
                            </li>
                            <li class="pwdmia">
                                <i class="iconfont icon-email"></i>
                                <input type="text" class="pwd" v-model="users.email" name="email" placeholder="请输入邮箱地址">
                            </li>
                        </ul>
                        <input @click="toRegister" type="submit" value="立即注册" class="sub">
                        <div style="color: red;font-size: 16px;text-align: center;margin-top: 20px;">{{ msg }}</div>
                    </div>
                    </div>
                </div>
            </div>

    </div>
</template>

<script>
import { register } from '@/request/login.js';
export default {
    name: 'Register',
    data() {
        return {
            users: {
                username: "",
                password: "",
                name: "",
                phone: "",
                address: "",
                email: ""
            },
            //注册后的提示信息
            msg: ""
        };
    },

    mounted() {

    },

    methods: {
        toRegister() {
            if(this.users.username==""||this.users.password==""){
                this.$message.warning("账号密码不能为空!")
                return
            }
            register(this.users).then(res=>{
                if(res.code == 200){
                    this.$message.success("注册成功已自动登录")
                    localStorage.setItem("user",JSON.stringify(res.data))
                    this.$bus.$emit('reload')
                    this.$router.push("/")
                }else{
                    this.$message.error(res.msg)
                }
            })
        }
    },
};
</script>

<style scoped>
@import url('@/assets/css/lgoin.css');
</style>